<template>
	<view class="container">
		<uni-popup ref="popup" type="center">
			<view class="advertisingBox" v-if="homeData.ad_alert">
				<image class="advertising" :src="homeData.ad_alert.img" mode="widthFix" @tap="navTo(homeData.ad_alert.url)"></image>
				<view class="close" @tap="close">
					<image class="close-icon" src="../../static/images/center/close.png" mode=""></image>
				</view>
			</view>
		</uni-popup>
		<view class="head-top">
			<view class="navBar">
				<view class="logo">
					<image class="logo-img" src="../../static/images/index/logo.png" mode=""></image>
					<text class="logo-text">国家普惠社区@2020</text>
				</view>
				<view class="sign" @tap="signIn">
					<image class="sign-img" src="../../static/images/index/sign.png" mode=""></image>
					<text class="sign-text">签到</text>
				</view>
			</view>
			<view class="locationSearch">
				<view class="location" @tap="getLocation(1)">
					<uni-icons class="icon" type="location-filled" color="#fff" size="10"></uni-icons>
					<text class="location-text clamp">{{Areaaddress}}</text>
					<text class="yticon icon-xia"></text>
				</view>
				<view class="search" @tap="search()">
					<icon class="icon" type="search" size="12" />
					<input class="search-input" disabled type="text" placeholder="请输入商品名称" />
				</view>
			</view>
		</view>
		<view class="header">
			<view class="carousel-section">
				<swiper :current="current" class="carousel" circular indicator-color="rgba(255,255,255,.5)" indicator-active-color="#fff"
				 indicator-dots="true" autoplay="true">
					<swiper-item @tap="navTo(item.ad_link)" v-for="(item, index) in homeData.banner" :key="index" class="carousel-item">
						<!-- <image class="carousel-item-img" lazy-load :src="item.ad_code" /> -->
						<easy-loadimage mode="aspectFill" :scroll-top="scrollTop" :image-src="item.ad_code"></easy-loadimage>
					</swiper-item>
				</swiper>
			</view>
			<view class="label">
				<view class="item" v-for="(item,index) in labelArr" :key="index">
					<image class="label-icon" :src="item.icon" mode=""></image>
					<text class="label-text">{{item.text}}</text>
				</view>
			</view>
			<view class="swiperBox" @click="test">
				<view class="circle"></view>
				<view class="wrapper">
					<image class="swiperBox-image" lazy-load src="../../static/images/index/1dsf.png" mode=""></image>
					<swiper class="swiper" circular="true" :autoplay="true" vertical="true" :interval="3000">
						<swiper-item v-for="(item,index) in homeData.roll" :key="index">
							<view class="swiper-item uni-bg-red">用户【{{item.nickname}}】{{item.mark}}</view>
						</swiper-item>
					</swiper>
				</view>
			</view>
		</view>
		<view class="btnBox">
			<view class="item" hover-class="hoverItem" :hover-stay-time="50" @tap="navTo(item.url)" v-for="(item,index) in homeData.menus"
			 :key="index">
				<!-- <image class="icon" :src="item.pic" mode=""></image> -->
				<view class="icon">
					<easy-loadimage mode="widthFix" :scroll-top="scrollTop" :image-src="item.pic"></easy-loadimage>
				</view>
				<text class="txt">{{item.name}}</text>
			</view>
		</view>
		<view class="divisionWrapper">
			<view class="store" v-if="homeData.offline_index">
				<view class="storeItem" v-for="(item,index) in homeData.offline_index[0]" :key="index" @tap="navTo(item.linke)">
					<easy-loadimage mode="aspectFill" :scroll-top="scrollTop" :image-src="item.image"></easy-loadimage>
				</view>
			</view>
			<view class="mallDivision" v-if="homeData.offline_index">
				<view class="left">
					<view class="left-img" @tap="navTo(homeData.offline_index[1][0].linke)">
						<easy-loadimage mode="aspectFill" :scroll-top="scrollTop" :image-src="homeData.offline_index[1][0].image"></easy-loadimage>
					</view>
				</view>
				<view class="right">
					<view class="right-top" @tap="navTo(homeData.offline_index[1][1].linke)">
						<easy-loadimage mode="aspectFill" :scroll-top="scrollTop" :image-src="homeData.offline_index[1][1].image"></easy-loadimage>
					</view>
					<view class="right-bottom">
						<view class="right-bottom-img" @tap="navTo(homeData.offline_index[1][2].linke)">
							<easy-loadimage mode="aspectFill" :scroll-top="scrollTop" :image-src="homeData.offline_index[1][2].image"></easy-loadimage>
						</view>
						<view class="right-bottom-img" @tap="navTo(homeData.offline_index[1][3].linke)">
							<easy-loadimage mode="aspectFill" :scroll-top="scrollTop" :image-src="homeData.offline_index[1][3].image"></easy-loadimage>
						</view>
					</view>
				</view>
			</view>
			<view class="storeSort" v-if="homeData.offline_index">
				<view class="storeSort-img" v-for="(item,index) in homeData.offline_index[2]" :key="index" @tap="navTo(item.linke)">
					<easy-loadimage mode="aspectFill" :scroll-top="scrollTop" :image-src="item.image"></easy-loadimage>
				</view>
			</view>
		</view>
		<view class="nearbyList" v-if="topGoods.length">
			<view class="title">
				<text class="title_text">商城推荐</text>
				<text class="label">优质品牌 放心之选</text>
			</view>
			<view class="goodslistBox">
				<goods-block :goodsList="topGoods" :scrollTop="scrollTop"></goods-block>
			</view>
			<view class="loadMore" v-show="loadMoreStatus" @tap="loadMore">
				查看更多
			</view>
			<uni-load-more v-show="!loadMoreStatus" iconType="circle" :status="loadStatus" :contentText="contentText"></uni-load-more>
		</view>
		<view class="companyInfo" v-show="companyInfoShow" v-if="homeData.platform_copyright">
			<view class="a">{{homeData.platform_copyright[0].platform_name}}</view>
			<view class="b">{{homeData.platform_copyright[0].platform_copyright_info}}</view>
			<view class="b bb">
				<image class="bb-img" lazy-load src="../../static/images/public/222.png" mode=""></image>
				<text>工信部ICP备案:{{homeData.platform_copyright[0].icp}} | </text>
				<image class="bb-img" lazy-load src="../../static/images/public/111.png" mode=""></image>
				<text>公网安备:{{homeData.platform_copyright[0].public_network_number}}</text>
			</view>
			<view>商务部商业预付备案:{{homeData.platform_copyright[0].prepaid_record_number}}</view>
		</view>
	</view>
</template>

<script>
	import {
		getHomeData,
		systemConfig,
		location,
		recommendProduct
	} from "@/api/public.js"
	import {
		getUserInfo
	} from "@/api/user.js"
	import {
		seller_check
	} from "@/api/merchant.js"
	import wechat from "@/common/wechat.js"
	import goodsBlock from "@/components/goodsBlock/goodsBlock.vue"
	import uniLoadMore from "@/components/uni-load-more/uni-load-more.vue";
	export default {
		name: "home",
		components: {
			goodsBlock,
			uniLoadMore
		},
		props: {
			scrollTop: {
				type: Number,
			}
		},
		data() {
			return {
				keywords: "", //搜索关键词
				labelArr: [{
						icon: "../../static/images/index/label1.png",
						text: "品质好物",
					},
					{
						icon: "../../static/images/index/label2.png",
						text: "买贵就赔",
					},
					{
						icon: "../../static/images/index/label3.png",
						text: "急速送达",
					},
					{
						icon: "../../static/images/index/label4.png",
						text: "售后无忧",
					},
				], //标签
				userInfo: {}, // 用户信息
				loginType: false, // 登陆状态
				current: 0, // 轮播
				Areaaddress: "定位中", //定位/选取城市
				longitude: "", // 定位/选取城市经度
				latitude: "", // 定位/选取城市维度
				homeData: {}, // 首页数据
				sellerCheck: 0, // 店铺入驻状态
				topSeller: [], // 离你最近店铺列表
				topGoods: [], // 商城推荐商品
				personal_shell_ration: 1, // 用户分佣比例
				loadMoreStatus: true,
				loadStatus: "loading",
				contentText: {
					contentdown: "",
					contentrefresh: "正在加载...",
					contentnomore: "小普加载完啦 去线上商城选购吧"
				},
				page: 1,
				limit: 10,
				companyInfoShow: false
			}
		},
		mounted() {

			// 用户分佣比例
			systemConfig({
				filed: 'personal_shell_ration'
			}).then(res => {
				this.personal_shell_ration = Number(res.msg) / 100;
			})
			//#ifdef H5
			var ua = window.navigator.userAgent.toLowerCase();
			if (ua.match(/Alipay/i) == "alipay") {
				const oScript = document.createElement('script');

				oScript.type = 'text/javascript';

				oScript.src = 'https://gw.alipayobjects.com/as/g/h5-lib/alipayjsapi/3.1.1/alipayjsapi.min.js';

				document.body.appendChild(oScript);
			}
			//#endif
		},
		methods: {
			test() {
				// var receiver;

				// receiver = plus.android.implements('com.iflytek.cloud.SynthesizerListener', {
				// });

				// var main = plus.android.runtimeMainActivity();

				// var SpeechUtility = plus.android.importClass('com.iflytek.cloud.SpeechUtility');

				// SpeechUtility.createUtility(main, "appid=__UNI__AD0BF76");

				// var SynthesizerPlayer = plus.android.importClass('com.iflytek.cloud.SpeechSynthesizer');

				// var play = SynthesizerPlayer.createSynthesizer(main, null);
				// // 开始合成  
				// play.startSpeaking('测试语音', receiver);




				// var main = plus.android.runtimeMainActivity()
				// var SpeechUtility = plus.android.importClass('com.iflytek.cloud.SpeechUtility')
				// console.log(SpeechUtility, 333333)
				// SpeechUtility.createUtility(main, "appid=__UNI__AD0BF76,")
				// var SynthesizerPlayer = plus.android.importClass('com.iflytek.cloud.SpeechSynthesizer')
				// var play = SynthesizerPlayer.createSynthesizer(main, null)

				// // 监听接收透传消息事件    
				// // plus.push.addEventListener('receive', function(msg) {
				// // 处理透传消息的业务逻辑代码 
				// let msg = {
				// 	content: '测试语音' //这里放处理的文字。根据实际需求改变
				// }
				// uni.getSystemInfo({
				// 	success: function(res) {
				// 		console.log(res.system, 'getSystemInfo1111111111');
				// 		if (parseInt(res.system) >= 8) { //判断安卓版本
				// 			let ttt = this.changeEnCode(msg.content) //处理文本
				// 			play.startSpeaking(ttt, null) // 播放播报

				// 		} else {
				// 			play.startSpeaking(msg.content, null) // 播放播报
				// 			console.log("receive: ", msg)
				// 		}

				// 	}
				// });
				// // }, false);
			},
			ticket(){
				uni.navigateTo({
					url: "../../mall/Ticket/IntegralMall"
				})
			},
			changeEnCode(str) {
				let res = []
				for (let i = 0; i < str.length; i++) {
					// 这个不是正常的encodeUnicode 颠倒了大小端的位置  
					res[i] = ("00" + str.charCodeAt(i).toString(16)).slice(-2) + ("00" + str.charCodeAt(i).toString(16)).slice(-4, -2)
				}
				let strCode = "\\u" + res.join("\\u")
				strCode = strCode.replace(/\\/g, "%")
				return unescape(strCode)
			},
			getIndex() {
				if (!uni.getStorageSync('selectCity')) {
					this.getHomeData();
					this.getTopGoods()
				}
				//判断登录状态获取数据
				if (uni.getStorageSync("Authori-zation")) {
					this.loginType = true
					getUserInfo().then(res => {
						setTimeout(() => {
							this.userInfo = res.data
						}, 10)
					})
				} else {
					this.loginType = false
				}
				let pages = getCurrentPages();
				let currPage = pages[pages.length - 1];
				if (currPage.reLocat) { //重新定位
					this.getLocation();
					return
				}
				if (currPage.selectCity) { //选择城市
					this.Areaaddress = currPage.Areaaddress;
					uni.removeStorageSync('selectCity')
					this.handleSelectCity();
				}
			},
			signIn() {
				// uni.showToast({
				// 	icon: "none",
				// 	title: "小普正在开发中，新功能即将上线"
				// })
				uni.navigateTo({
					url: './home-sign/sign-index'
				})
			},
			// 跳转路径
			navTo(url) {
				this.close()
				if (url == "" || url == "#") {
					uni.showToast({
						icon: "none",
						title: "小普正在开发中，新功能即将上线"
					})
				}
				if (url == "/pages/center/storeApply/storeApply") {
					if (this.loginType) {
						if (this.userInfo.user_kind < 3) {
							seller_check().then(res => {
								this.sellerCheck = res.data.check;
								if (this.sellerCheck == 1) {
									uni.navigateTo({
										url: "/pages/center/storeApply/storeApply"
									})
									return
								} else if (this.sellerCheck == 2) {
									uni.navigateTo({
										url: "/pages/center/storeApply/storeApply?status=" + this.sellerCheck
									})
									return
								} else if (this.sellerCheck == 3) {
									uni.navigateTo({
										url: '/business/business'
									})
									return
								} else if (this.sellerCheck == 4) {
									uni.navigateTo({
										url: "/pages/center/storeApply/applyFail"
									})
									return
								} else if (this.sellerCheck == 5) {
									uni.showModal({
										content: "商户处于禁用状态",
										confirmText: "确定",
										showCancel: false
									})
									return
								}
							})
						} else if (this.userInfo.user_kind == 2) {
							uni.showModal({
								content: "您已是代理商，不能入驻店铺",
								confirmText: "确定",
								showCancel: false
							})
							return
						} else if (this.userInfo.user_kind == 3) {
							uni.showModal({
								content: "您已是渠道商，不能入驻店铺",
								confirmText: "确定",
								showCancel: false
							})
							return
						} else if (this.userInfo.user_kind == 4) {
							uni.showModal({
								content: "您已是地堆人员，不能入驻店铺",
								confirmText: "确定",
								showCancel: false
							})
							return
						} else if (this.userInfo.user_kind == 5) {
							uni.showModal({
								content: "您已是运营中心，不能入驻店铺",
								confirmText: "确定",
								showCancel: false
							})
							return
						} else if (this.userInfo.user_kind == 6) {
							uni.showModal({
								content: "您已是技术部，不能入驻店铺",
								confirmText: "确定",
								showCancel: false
							})
							return
						}
					} else {
						uni.navigateTo({
							url: "/pages/login/login"
						})
						return
					}
				} else {
					uni.navigateTo({
						url: url
					})
				}
			},
			// 选择城市后逆地址解析并缓存位置信息
			handleSelectCity() {
				//#ifndef H5
				uni.request({
					url: 'https://apis.map.qq.com/ws/geocoder/v1',
					data: {
						address: this.Areaaddress,
						// region: "",
						key: "7YDBZ-PZSWP-7UCDU-LMHBU-QSTXQ-W2FEO",
						output: 'json',
					},
					success: (res) => {
						this.longitude = res.data.result.location.lng;
						this.latitude = res.data.result.location.lat;
						this.getHomeData()
						uni.setStorageSync('Areaaddress', this.Areaaddress)
						uni.setStorageSync('longitude', this.longitude)
						uni.setStorageSync('latitude', this.latitude)
					}
				})
				//#endif
				//#ifdef H5
				location({
					address: this.Areaaddress,
					latitude: "",
					longitude: ""
				}).then(res => {
					this.longitude = res.data.location.location.lng;
					this.latitude = res.data.location.location.lat;
					this.getHomeData()
					uni.setStorageSync('Areaaddress', this.Areaaddress)
					uni.setStorageSync('longitude', this.longitude)
					uni.setStorageSync('latitude', this.latitude)
				})
				//#endif
			},
			// 获取位置信息
			getLocation(link) {
				if (link) {
					return uni.navigateTo({
						url: `/pages/index/selectCity?currentCity=${this.Areaaddress}`,
					})
				}
				let _this = this

				// #ifdef APP-PLUS
				uni.getLocation({
					type: 'gcj02',
					geocode: true,
					success: function(res) {
						_this.Areaaddress = res.address.city;
						_this.longitude = res.longitude
						_this.latitude = res.latitude
						// 实际位置
						uni.setStorageSync('locatAddress', _this.Areaaddress)
						uni.setStorageSync('locatLongitude', _this.longitude)
						uni.setStorageSync('locatLatitude', _this.latitude)
						// 选择位置
						uni.setStorageSync('Areaaddress', _this.Areaaddress)
						uni.setStorageSync('longitude', _this.longitude)
						uni.setStorageSync('latitude', _this.latitude)
						_this.getHomeData()
					},
					fail: function(err) {
						console.log('dizhierr', err)
					}

				})
				// #endif
				// #ifdef H5
				var ua = window.navigator.userAgent.toLowerCase();
				if (ua.match(/micromessenger/i) == 'micromessenger') {
					// 微信h5定位
					wechat.getLocation().then(res => {
						location({
							latitude: res.latitude,
							longitude: res.longitude
						}).then(re => {
							_this.Areaaddress = re.data.location.address_component.city;
							_this.longitude = res.longitude;
							_this.latitude = res.latitude;

							// 实际位置
							uni.setStorageSync('locatAddress', _this.Areaaddress)
							uni.setStorageSync('locatLongitude', _this.longitude)
							uni.setStorageSync('locatLatitude', _this.latitude)
							// 选择位置
							uni.setStorageSync('Areaaddress', _this.Areaaddress)
							uni.setStorageSync('longitude', _this.longitude)
							uni.setStorageSync('latitude', _this.latitude)
							_this.getHomeData()
						})
					})
				} else if (ua.match(/Alipay/i) == "alipay") {
					// 支付宝h5定位
					ap.getLocation({
						type: 0
					}, function(res) {
						_this.Areaaddress = res.city;
						_this.longitude = res.longitude
						_this.latitude = res.latitude
						// 实际位置
						uni.setStorageSync('locatAddress', _this.Areaaddress)
						uni.setStorageSync('locatLongitude', _this.longitude)
						uni.setStorageSync('locatLatitude', _this.latitude)
						// 选择位置
						uni.setStorageSync('Areaaddress', _this.Areaaddress)
						uni.setStorageSync('longitude', _this.longitude)
						uni.setStorageSync('latitude', _this.latitude)
						_this.getHomeData()
					})
				}
				// #endif
			},
			// 获取首页数据
			getHomeData() {
				let _this = this;
				let Areaaddress = ''
				if (_this.Areaaddress != "定位中") {
					Areaaddress = _this.Areaaddress
				}
				getHomeData({
					region: Areaaddress,
					position: 51334
				}).then(res => {
					setTimeout(() => {
						_this.homeData = res.data
						let nowTime = new Date(new Date().toLocaleDateString()).getTime() / 1000
						let lastTime = uni.getStorageSync("advertisingTime")
						if (uni.getStorageSync("advertisingShow") && nowTime !== lastTime && _this.homeData.ad_alert.is_alert) {
							this.$refs.popup.open()
							uni.setStorageSync("advertisingTime", nowTime)
						}
					}, 10)
					if (_this.Areaaddress == "定位中") {
						_this.getLocation()
					}
				})
			},
			// 跳转搜索
			search() {
				uni.navigateTo({
					url: `/pages/index/search?type=1`
				});
			},
			//获取商城推荐商品
			getTopGoods() {
				recommendProduct({
					page: this.page,
					limit: this.limit
				}).then(res => {
					this.companyInfoShow = true
					let topGoods = res.data.list.map((val, key) => {
						val.blackS = (Number(val.price) * ((100 - val.rebate_ratio) * this.personal_shell_ration) / 100).toFixed(2);
						return val
					})
					this.topGoods.push.apply(this.topGoods, topGoods);
					if (topGoods.length < this.limit) {
						this.loadStatus = "noMore"; //判断所有数据是否加载完成；
						this.loadMoreStatus = false
					} else {
						if (this.page !== 1) {
							this.loadMoreStatus = !this.loadMoreStatus
						}
					}
					this.page = this.page + 1;
				})
			},
			loadMore() {
				this.loadMoreStatus = !this.loadMoreStatus
				this.getTopGoods()
			},
			close() {
				this.$refs.popup.close()
			}
		},
		onHide() {
			this.$refs.popup.close()
		}
	}
</script>
<style lang="scss" scoped>
	.container {
		background-color: #fafafa;

		.advertisingBox {
			.advertising {
				width: 600rpx;
			}

			.close {
				display: flex;
				flex-direction: column;
				align-items: center;
				padding-top: 20rpx;

				.close-icon {
					width: 20rpx;
					height: 20rpx;
					padding: 25rpx;
					border-radius: 50%;
					background-color: rgba(255, 255, 255, .8);
				}
			}
		}

		.head-top {
			position: sticky;
			top: 0;
			z-index: 9;
		}

		.navBar {
			padding: 0 30rpx;
			z-index: 99;
			//#ifdef APP-PLUS
			padding-top: calc(20rpx + var(--status-bar-height));
			//#endif
			//#ifdef H5
			padding-top: 20rpx;
			//#endif
			display: flex;
			justify-content: space-between;
			align-items: center;
			background: linear-gradient(90deg, #FF4929 0%, #FB663E 100%);
			;

			.logo {
				display: flex;
				align-items: baseline;

				.logo-img {
					width: 197rpx;
					height: 54rpx;
				}

				.logo-text {
					position: relative;
					bottom: 4rpx;
					margin-left: 20rpx;
					font-size: 22rpx;
					color: #fff;
					opacity: .4;
				}
			}

			.sign {
				display: flex;
				align-items: center;

				.sign-img {
					width: 34rpx;
					height: 33rpx;
				}

				.sign-text {
					margin-left: 10rpx;
					font-size: 24rpx;
					color: #FFF;
				}
			}
		}

		.locationSearch {
			display: flex;
			align-items: center;
			padding: 20rpx 30rpx;
			background: linear-gradient(90deg, #FF4929 0%, #FB663E 100%);

			.location {
				color: #fff;
				display: flex;
				align-items: center;
				margin-right: 14rpx;

				.icon {
					margin-top: 8rpx;
					margin-right: 6rpx;
				}

				.location-text {
					max-width: 130rpx;
					font-size: 28rpx !important;
				}

				.yticon {
					margin-top: 10rpx;
					margin-left: 6rpx;
					font-size: 20rpx;
				}
			}

			.search {
				position: relative;
				flex: 1;

				.icon {
					position: absolute;
					left: 18rpx;
					top: 18rpx;
					width: 30rpx;
					height: 30rpx;
					color: #999;
				}

				.search-input {
					padding-left: 60rpx;
					width: 100%;
					height: 60rpx;
					line-height: 60rpx;
					background: #fff;
					box-sizing: border-box;
					border-radius: 20rpx;
					font-size: 28rpx;
				}
			}
		}

		.header {
			box-sizing: border-box;
			background: linear-gradient(90deg, #FF4929 0%, #FB663E 100%);
			position: relative;

			.carousel-section {
				padding: 10rpx 30rpx 0;
				position: relative;

				.carousel {
					border-radius: 20rpx;
					box-shadow: 0px 6rpx 20rpx 0px rgba(0, 0, 0, 0.1);
					width: 100%;
					height: 280rpx;

					.carousel-item {
						width: 100%;
						height: 100%;
						box-sizing: border-box;
						overflow: hidden;
						border-radius: 20rpx;

						.carousel-item-img {
							width: 100%;
							height: 100%;
							border-radius: 20rpx;
						}
					}
				}
			}

			.label {
				display: flex;
				align-items: center;
				justify-content: space-between;
				padding: 20rpx 30rpx;

				.item {
					display: flex;
					justify-content: center;
					align-items: center;

					.label-icon {
						width: 40rpx;
						height: 30rpx;
					}

					.label-text {
						margin-left: 8rpx;
						font-size: 24rpx;
						color: #fff;
					}
				}
			}

			.swiperBox {
				background: #fafafa;
				width: 750rpx;
				padding: 0 0 10rpx;
				overflow: hidden;
				position: relative;

				.circle {
					position: absolute;
					top: -40rpx;
					width: 750rpx;
					height: 80rpx;
					border-radius: 50%;
					background: linear-gradient(90deg, #FF4929 0%, #FB663E 100%);
				}

				.wrapper {
					position: relative;
					left: 30rpx;
					z-index: 1;
					width: 690rpx;
					box-sizing: border-box;
					padding: 16rpx;
					background: #fff;
					border-radius: 20rpx;
					background: #fff;
					box-shadow: 0 0 10rpx rgba(0, 0, 0, .2);
					display: flex;

					.swiperBox-image {
						width: 50rpx;
						height: 50rpx;
						margin-right: 26rpx;
					}

					.swiper {
						flex: 1;
						font-size: 26rpx;
						color: #777;
						letter-spacing: 5rpx;
						height: 50rpx;
						line-height: 50rpx;

						.swiper-item {
							overflow: hidden;
							display: block;
							white-space: nowrap;
							text-overflow: ellipsis;
						}
					}
				}

			}
		}

		.btnBox {
			padding: 20rpx 0;
			display: flex;
			flex-wrap: wrap;

			.item {
				display: flex;
				flex-direction: column;
				align-items: center;
				width: 25%;
				min-width: 25%;
				margin-bottom: 30rpx;

				.icon {
					width: 90rpx;
					height: 90rpx;
					border-radius: 50%;
					overflow: hidden;
					margin-bottom: 10rpx;
				}

				.txt {
					color: #757575;
					font-size: 26rpx;
				}
			}

		}

		.divisionWrapper {
			padding: 0 30rpx;

			.store {
				display: flex;
				justify-content: space-between;

				.storeItem {
					width: 340rpx;
					height: 150rpx;
					background: #eee;
					border-radius: 20rpx;
					overflow: hidden;
				}
			}

			.mallDivision {
				margin-top: 30rpx;
				padding: 20rpx;
				border-radius: 20rpx;
				background-color: #fff;
				box-shadow: 0px 4rpx 10rpx 0px rgba(21, 21, 21, 0.07);
				display: flex;
				justify-content: space-between;
				
				.left {
					.left-img {
						width: 270rpx;
						height: 370rpx;
						background: #eee;
						border-radius: 10rpx;
						overflow: hidden;
					}
				}

				.right {
					width: 360rpx;
					height: 370rpx;
					display: flex;
					flex-direction: column;
					justify-content: space-between;

					.right-top {
						width: 360rpx;
						height: 160rpx;
						background: #eee;
						border-radius: 10rpx;
						overflow: hidden;
					}

					.right-bottom {
						display: flex;
						justify-content: space-between;

						.right-bottom-img {
							width: 170rpx;
							background: #eee;
							height: 190rpx;
							border-radius: 10rpx;
							overflow: hidden;
						}
					}
				}
			}

			.storeSort {
				margin-top: 30rpx;
				display: flex;
				justify-content: space-between;

				.storeSort-img {
					width: 210rpx;
					height: 260rpx;
					border-radius: 20rpx;
					overflow: hidden;
					background: #eee;
					box-shadow: 0 0 20rpx rgba(0, 0, 0, .05);
				}
			}
		}

		.nearbyList {
			padding: 30rpx;

			.title {
				margin-top: 20rpx;
				margin-bottom: 20rpx;
				display: flex;
				flex-direction: column;
				align-items: center;
				justify-content: center;

				.title_text {
					font-size: 36rpx;
					font-weight: bold;
					color: #E74546;
					background: linear-gradient(0deg, #E64443 0%, #FF8D8D 99.6337890625%);
					-webkit-background-clip: text;
					-webkit-text-fill-color: transparent;
				}

				.label {
					font-size: 24rpx;
					color: #AEAEAE;
				}
			}

			.goodslistBox {
				margin-bottom: 30rpx;
			}
		}

		.loadMore {
			font-size: 28rpx;
			margin: 30rpx auto 0;
			width: 185rpx;
			height: 46rpx;
			text-align: center;
			line-height: 46rpx;
			color: #AEAEAE;
			border: 1rpx solid #AEAEAE;
			border-radius: 20rpx;
		}

		.companyInfo {
			margin-top: 50rpx;
			padding-bottom: 70px;
			padding-bottom: calc(70px + env(safe-area-inset-bottom));
			height: 78px;
			overflow: hidden;
			width: 100%;
			font-size: 10px;
			color: #999;
			text-align: center;
			line-height: 12px;

			.b {
				margin-top: 5px;
			}

			.bb {

				display: flex;
				align-items: center;
				justify-content: center;

				.bb-img {
					margin-left: 6rpx;
					width: 20rpx;
					height: 20rpx;
				}
			}
		}
	}
</style>
